<!DOCTYPE html>
<html lang="zxx" class="no-js">

<head>
	<!-- Mobile Specific Meta -->
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<!-- Favicon-->
	<link rel="shortcut icon" href="static/img/fav.png">
	<!-- Author Meta -->
	<meta name="author" content="codepixer">
	<!-- Meta Description -->
	<meta name="description" content="">
	<!-- Meta Keyword -->
	<meta name="keywords" content="">
	<!-- meta character set -->
	<meta charset="UTF-8">
	<!-- Site Title -->
	<title>Home</title>

	<!--
			Google Font
			============================================= -->
	<link href="https://fonts.googleapis.com/css?family=Montserrat:300,500,600" rel="stylesheet">
	<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500i" rel="stylesheet">

	<!--
			CSS
			============================================= -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/themify-icons/0.1.2/css/themify-icons.css">
	<link rel="stylesheet" href="static/css/linearicons.css">
	<link rel="stylesheet" href="static/css/font-awesome.min.css">
	<link rel="stylesheet" href="static/css/bootstrap.css">
	<link rel="stylesheet" href="static/css/magnific-popup.css">
	<link rel="stylesheet" href="static/css/nice-select.css">
	<link rel="stylesheet" href="static/css/animate.min.css">
	<link rel="stylesheet" href="static/css/owl.carousel.css">
	<link rel="stylesheet" href="static/css/main.css">
</head>

<body>

	<!-- Start Header Area -->
	<header id="header">
		<div class="container">
			<div class="row align-items-center justify-content-between d-flex">
				<div id="logo">
					<a href="/index"><img src="static/img/logo.png" alt="" title="" /></a>
				</div>
				<nav id="nav-menu-container">
					<ul class="nav-menu">
						<li class="menu-active"><a href="/index">首页</a></li>
						<li><a href="/about">关于</a></li>
						<li><a href="/movie">电影</a></li>
						<li><a href="/score">评分</a></li>
					</ul>
				</nav><!-- #nav-menu-container -->
			</div>
		</div>
	</header>
	<!-- End Header Area -->

	<!-- Start Banner Area -->
	<section class="home-banner-area relative">
		<div class="container">
			<div class="row fullscreen d-flex align-items-center justify-content-center">
				<div class="banner-content col-lg-8 col-md-12">
					<h1 class="wow fadeIn" data-wow-duration="4s">豆瓣电影top250<br>
						数据可视化——电影列表</h1>
					<p class="text-white">
						应用Python爬虫、flask框架、echarts、Wordcloud等技术实现
					</p>

				</div>
			</div>
		</div>
		<div class="rocket-img">
			<img src="static/img/rocket.png" alt="">
		</div>
	</section>
	<!-- End Banner Area -->

	<!-- Start Faculty Area -->
	<section class="faculty-area section-gap">
		<div class="container">
			<div class="row justify-content-center">
				<div class="col-lg-8">
					<div class="section-title text-center">
						<h1>我们的目标</h1>
						<p>
							看煽情的电影，撩最靓的妹子；<br>
							学实用的技术，做真实的自己。
						</p>
					</div>
				</div>
			</div>
			<div class="row justify-content-center d-flex align-items-center">
				<table class="table table-striped">
					<tr>
						<td>排名</td>
						<td>电影名称</td>
						<td>评分</td>
						<td>评价人数</td>
						<td>影片概况</td>
						<td>相关信息</td>
					</tr>
					{% for movie in movies %}
						<!-- {{ movie|e }} -->
						<tr>
							<td>{{ movie[0]|e }}</td>
							<td>{{ movie[3][1:-1]|e }}</td>
							<td>{{ movie[4][1:-1]|e }}</td>
							<td>{{ movie[5][1:-1]|e }}</td>
							<td>{{ movie[6][1:-1]|e }}</td>
							<td>{{ movie[7][3:-3]|e }}</td>
						</tr>
					{% endfor %}
					
				</table>
			</div>
		</div>
	</section>
	<!-- End Faculty Area -->

	<!-- Start Footer Area -->
	<footer>
		<div class="meta-text text-center">
			<ul><li>联系我们：牛×.svip@vip.com</li></ul><br>
		</div>
	</footer>
	<!-- End Footer Area -->

	<script src="static/js/vendor/jquery-2.2.4.min.js"></script>
	<script src="static/js/popper.min.js"></script>
	<script src="static/js/vendor/bootstrap.min.js"></script>
	<!---<script static/type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBhOdIF3Y9382fqJYt5I_sswSrEw5eihAA"></script>--->
	<script src="static/js/easing.min.js"></script>
	<script src="static/js/hoverIntent.js"></script>
	<script src="static/js/superfish.min.js"></script>
	<script src="static/js/jquery.ajaxchimp.min.js"></script>
	<script src="static/js/jquery.magnific-popup.min.js"></script>
	<script src="static/js/owl.carousel.min.js"></script>
	<script src="static/js/owl-carousel-thumb.min.js"></script>
	<script src="static/js/jquery.sticky.js"></script>
	<script src="static/js/jquery.nice-select.min.js"></script>
	<script src="static/js/parallax.min.js"></script>
	<script src="static/js/waypoints.min.js"></script>
	<script src="static/js/wow.min.js"></script>
	<script src="static/js/jquery.counterup.min.js"></script>
	<script src="static/js/mail-script.js"></script>
	<script src="static/js/main.js"></script>
</body>

</html>